<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <link href="./css/common.css" rel="stylesheet">
    <link href="./css/index.css" rel="stylesheet">
    <link href="./css/project.css" rel="stylesheet">
    <link href="./tools/iconfont/iconfont.css" rel="stylesheet">
    <link href="./css/contactUs.css"  rel="stylesheet" >
    <script type="text/javascript" src="./js/jquery-1.9.1.min.js"></script>
    <link rel="stylesheet" href="./tools/slider/swiper.min.css">
    <script src="./tools/slider/swiper.min.js"></script>
    <title>名婴之家_关于我们</title>
</head>
<body>
<!--头部搜索和nav导航-->
<script src="js/header.js"></script>
<!--页面位置-->
<div class="container">
    <div class="postion">
        <i class="point"></i>您的位置：关于我们/<i class="now_postion">联系我们</i>
    </div>
</div>
<!--内容区域-->
<div class="container" style="background: #fff">
    <!--联系我们-->
    <div class="contact_box">
        <div class="link_box">
            <!-- Swiper -->
            <div class="swiper-container">
                <!-- Add Pagination -->
                <div class="swiper-pagination">
                </div>
                <div class="swiper-wrapper">
                    <div class="swiper-slide" >
                        <form action="" method="post" id="form1">
                        <p><span>产品类型:</span><input type="text" name="proName" required oninvalid="setCustomValidity('请填产品类型')" oninput="setCustomValidity('')"></p>
                        <p>
                            <span >姓名:</span><input type="text" style="width:100px!important; " required name="name" oninvalid="setCustomValidity('请填写姓名')" oninput="setCustomValidity('')">
                            <span style="text-align: left;margin-left: 10px;width: 40px">电话:</span><input type="tel" style="width:176px!important; " name="tel" required oninvalid="setCustomValidity('请填写电话')" oninput="setCustomValidity('')">
                        </p>
                        <p><span>公司名称:</span><input type="text" name="firmName" required oninvalid="setCustomValidity('请填写公司名称')" oninput="setCustomValidity('')"></p>
                        <p><span>电子邮箱:</span><input type="email" name="email"></p>
                        <button type="submit" >提交申请</button>
                        </form>
                    </div>
                    <div class="swiper-slide" >
                        <form action="" method="post" id="form2">
                        <p><span>姓名:</span><input type="text" name="name" required oninvalid="setCustomValidity('请填写姓名')" oninput="setCustomValidity('')"></p>
                        <p><span>电话:</span><input type="tel" name="tel" required oninvalid="setCustomValidity('请填写电话')" oninput="setCustomValidity('')"></p>
                        <p><span>电子邮箱:</span><input type="email" name="email"></p>
                        <button type="submit">提交申请</button>
                        </form>
                    </div>
                    <div class="swiper-slide" >
                        <form action="" method="post" id="form3">
                        <p><span>姓名:</span><input type="text" name="name" required oninvalid="setCustomValidity('请填写姓名')" oninput="setCustomValidity('')"></p>
                        <p><span>电话:</span><input type="tel" name="tel" required oninvalid="setCustomValidity('请填写电话')" oninput="setCustomValidity('')"></p>
                        <p><span>电子邮箱:</span><input type="email" name="email"></p>
                        <button type="submit" onclick="">提交申请</button>
                        </form>
                    </div>
                </div>
            </div>
            <!-- Initialize Swiper -->
            <script>
                var swiper = new Swiper('.swiper-container', {
                    speed:600,
                    effect : 'coverflow',
                    simulateTouch : false,//鼠标禁用
                    pagination: {
                        el: '.swiper-pagination',
                        clickable: true,
                        renderBullet: function (index, className) {
                            return '<span class="' + className + '">' + '</span>';
                        },
                    },
                });
                $(".swiper-pagination-bullets span").eq(0).html("<i>招商加盟</i>");
                $(".swiper-pagination-bullets span").eq(1).html("<i>培训教练加入</i>");
                $(".swiper-pagination-bullets span").eq(2).html("<i>服务人员加入</i>")
            </script>
        </div>
            <div class="clear"></div>
    </div>
    <!--地图展示-->
    <div class="map_box">
        <div id="map"></div>
    </div>
    <script>
        $("form").submit(function () {
             var val=$(this).value;
             console.log(val)
        })
    </script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=F2EGKvheXCQUGHGw1xZH9MqVlpcbEhm6"></script>
    <script type="text/javascript">
        // 百度地图API功能
        var map = new BMap.Map("map");    // 创建Map实例
        var point = new BMap.Point(103.969095,30.679749);
        map.centerAndZoom(point, 15);
        var marker = new BMap.Marker(point);        // 创建标注
        map.addOverlay(marker);
        var opts = {
            width : 200,     // 信息窗口宽度
            height: 100,     // 信息窗口高度
            title : "中铁西城"  // 信息窗口标题
        }
        var infoWindow = new BMap.InfoWindow("地址：四川省成都市青羊区中铁西城  Tel:19980412991  19980410991   QQ:1004345373", opts);  // 创建信息窗口对象
        map.openInfoWindow(infoWindow, map.getCenter());
        map.addControl(new BMap.NavigationControl());
        map.addControl(new BMap.ScaleControl());
        map.addControl(new BMap.OverviewMapControl());
        map.setCurrentCity("成都"); // 仅当设置城市信息时，MapTypeControl的切换功能才能可用
    </script>
</div>


<!-- 联系我们 -->
<!--footer-->
<script src="js/footer.js"></script>
</body>

</html>